<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <title>DT-CHAT</title>
  <link rel="shortcut icon" href="../static/img/favicon.ico" type="image/x-icon" />
  <link rel="stylesheet" type="text/css" href="../static/js/layui-v2.9.7/layui/css/layui.css">
  <link rel="stylesheet" type="text/css" href="../static/css/style.css">
  <link rel="stylesheet" type="text/css" href="../static/css/index.css">
</head>

<body>

  <div class="app">
    <div class="left-block">
      <img style="width: 1.66rem;height: .35rem;margin-top: .1rem;margin-left: .1rem;" src="../static/img/logo.png">
      <div class="version">当前版本：v1.0.1</div>
      <div class="left-btns">
        <div class="left-btns-item active" onclick="window.location.href='./index.html'">
          <img src="../static/img/icon1.png"><span>对话</span>
        </div>
        <div class="left-btns-item" onclick="window.location.href='./knowledgebasemanagement.html'">
          <img src="../static/img/icon2.png"><span>知识库管理</span>
        </div>
        <div class="left-btns-item" onclick="window.location.href='./rolemanagement.html'">
          <img src="../static/img/icon18.png"><span>对话人设管理</span>
        </div>
        <div class="left-btns-item" onclick="window.location.href='./questionmanagement.html'">
          <img src="../static/img/icon3.png"><span>常用问题管理</span>
        </div>
        <div class="left-btns-item" onclick="window.location.href='./usermanagement.html'">
          <img src="../static/img/icon23.png"><span>用户管理</span>
        </div>
      </div>
      <div style="position: absolute;bottom: .2rem;width: 100%;text-align: center;">
        <button type="button" class="layui-btn layui-btn-sm layui-bg-blue" onclick="showEditPasswordWindow()">
          <i class="layui-icon layui-icon-username"></i>
          我的
        </button>
        <button type="button" style="border: .01rem solid #A3CAFF;color: #9EC7FF !important;"
          class="layui-btn layui-btn-sm layui-btn-primary layui-border" onclick="logout()">
          <i class="layui-icon layui-icon-logout"></i>
          退出
        </button>
      </div>
    </div>
    <div class="center-block">
      <div class="center-btns">
        <div class="center-btns-item active" data-index="1">LLM对话</div>
        <div class="center-btns-item" data-index="2">知识库对话</div>
        <!-- <div class="center-btns-item" data-index="3">文件对话</div> -->
      </div>
      <div class="dropdown-menu" id="dropdown-menu" style="position: absolute;right: .5rem;top: 0.2rem;cursor: pointer;"
        onclick="">
        <i class="layui-icon layui-icon-component" style="color: #fff;"></i>
      </div>
      <div class="talk-content">
        <div id="tip-llm" class="tip-block">
          <img src="../static/img/icon9.png" style="width: .6rem;height: 1.36rem;margin: 0 0.5rem;">
          <div style="font-size: .18rem;width: 100%;">
            <p style="font-size: .2rem;">Hi 我是DT Chat</p>
            <br>
            <p>遇到问题就来找我，让我帮你出谋划策。</p>
            <br>
            <br>
            <p>试试以下例子：</p>
            <br>
            <div class="example-block">
              <div class="example-item" data-index="1">
                <div class="example-title" style="color:#23E6FF">
                  <img src="../static/img/icon20.png">
                  你是一个消防安全专家
                </div>
                <div class="example-content">请帮我制定一份详细有效的火灾预防方案模板</div>
              </div>
              <div class="example-item" data-index="2">
                <div class="example-title" style="color:#23FCFF">
                  <img src="../static/img/icon21.png">
                  你是一个心理健康专家
                </div>
                <div class="example-content">消防员群体的工作压力巨大，请帮我分析他们可能有的心理健康状态，辅助提供及时的心理支持 </div>
              </div>
              <div class="example-item" data-index="3">
                <div class="example-title" style="color:#FFF899">
                  <img src="../static/img/icon22.png">
                  你是一个新媒体专家
                </div>
                <div class="example-content">这个月是消防安全宣传月，请帮我写一篇公众号文章进行宣传，其中需要包含一个消防安全教育顺口溜 </div>
              </div>
            </div>
          </div>
        </div>
        <div id="tip-knowledgebase" class="tip-block" style="display: none;">
          <div>
            <p style="font-size: .24rem;">知识库解答助手</p>
            <br>
            <p style="font-size: .14rem;">问答知识库通过建立问题与答案的对应关系，使用户能够直接通过提问来获取信息，避免了繁琐的检索过程，提高了信息获取的效率。</p>
          </div>
        </div>
        <div id="tip-file" class="tip-block" style="display: none;">
          <div>
            <p style="font-size: .24rem;">文档解答助手</p>
            <br>
            <p style="font-size: .14rem;">上传一篇文档，或者针对文档内容进行解答，迎接更智能，更直观的处理文档方式。</p>
          </div>
        </div>
        <div id="answer-llm"></div>
        <div id="answer-knowledgebase" style="display: none;"></div>
        <div id="answer-file" style="display: none;"></div>
      </div>
      <div style="position: absolute;bottom: 0.7rem;">
        <button style="display: none;" type="button" class="layui-btn layui-btn-primary layui-border-red" id="stop-btn"
          onclick="stopTalk()">
          <i class="layui-icon layui-icon-pause"></i>
          停止生成
        </button>
        <button style="display: none;" type="button" class="layui-btn layui-btn-primary layui-border-blue"
          id="retalk-btn" onclick="reTalk()">
          <i class="layui-icon layui-icon-refresh"></i>
          重新生成
        </button>
      </div>
      <div class="talk-question layui-form">
        <input id="query" type="text" lay-affix="release" lay-filter="release" placeholder="输入您的问题或者需求"
          class="layui-input">
      </div>
    </div>
    <div class="right-block layui-form">
      <div style="height: calc(100% - 0.9rem);overflow: auto;scrollbar-width: none;">
        <div id="knowledgebase-setting" style="color: #fff;margin: .1rem;display: none;">
          <div style="display: flex;margin-bottom: .1rem;">
            <img id="setting-img" style="width: .2rem;height: .2rem;margin-right: .1rem;"
              src="../static/img/icon12.png">
            <span>知识库配置</span>
          </div>
          <div style="margin-bottom: .1rem;">
            <div style="margin-bottom: .1rem;">请选择知识库：</div>
            <select id="knowledgebase-select"></select>
          </div>
          <div style="margin-bottom: .1rem;">
            <div style="margin-bottom: .1rem;">匹配知识条数：</div>
            <input id="knowledge-len" type="number" lay-affix="number" placeholder="" min="0" max="20" value="4"
              class="layui-input">
          </div>
          <div style="margin-bottom: .1rem;">
            <div style="margin-bottom: .2rem;">知识匹配分数阈值：</div>
            <div id="score-slider"></div>
          </div>
        </div>
        <div style="display: flex;color: #fff;margin: .1rem;" id="test">
          <img style="width: .2rem;height: .2rem;margin-right: .1rem;" src="../static/img/icon4.png">
          <span>问答设置</span>
        </div>
        <div class="right-btns flow-demo" id="flow-role"
          style="max-height: 1.5rem;overflow: auto;scrollbar-width: none;">
        </div>
        <div class="right-cards flow-demo" id="flow-question">

        </div>
        <!-- <div style="position: absolute;bottom: 0.6rem;width: 100%;"> -->
        <div style="width: 100%;">
          <div class="temperature" style="color: #fff;margin: .2rem .1rem;">
            <div>temperature：</div>
            <div id="slider" style="margin-top: .2rem;"></div>
          </div>
          <div class="history-talk" style="color: #fff;margin: .2rem .1rem;">
            <div>历史对话轮数：</div>
            <input id="history-len" type="number" lay-affix="number" placeholder="" min="0" max="10" value="6"
              class="layui-input" style="margin-top: .2rem;">
          </div>
        </div>
      </div>

      <div style="position: absolute;bottom:.2rem;width: 100%;text-align: center;">
        <button type="button" class="layui-btn layui-bg-blue" lay-submit lay-filter="export">导出记录</button>
        <button class="layui-btn layui-btn-primary layui-border" style="border: .01rem solid #A3CAFF;
        color: #9EC7FF !important;" lay-submit lay-filter="clear">清空对话</button>
      </div>
    </div>
  </div>
  <script type="text/javascript" src="../static/js/layui-v2.9.7/layui/layui.js"></script>
  <script type="text/javascript" src="../static/js/jquery/jquery.min.js"></script>
  <script type="text/javascript" src="../static/js/marked.min.js"></script>
  <script type="text/javascript" src="../static/js/showdown.min.js"></script>
  <script type="text/javascript" src="../static/js/app.js"></script>
  <script type="text/javascript" src="../static/js/index.js"></script>
</body>

</html>